<template>
  <IFexHeaderMain>
    <template #header>
      <image :src="'/static/img/fc/smrz_title.png'" mode="aspectFit" style="width: 100vw; max-width: 100%; height: auto; image-rendering: -webkit-optimize-contrast" />
    </template>
    <view class="home_main whov">
      <view class="form_row">
        <view class="flex_left_right from_input">
          <view class="flex_left" style="color: #808080; margin-right: 146rpx">姓名</view>
          <view class="flex_right">{{ userName }}</view>
        </view>
        <view class="flex_left_right from_input">
          <view class="flex_left" style="color: #808080; margin-right: 90rpx">身份证号</view>
          <view class="flex_right">{{ idCard }}</view>
        </view>
      </view>
      <image :src="'/static/img/fc/smrz_bottom.png'" @click="onClick" mode="aspectFit" style="margin-top: 50rpx; width: 100vw; max-width: 100%; height: auto; image-rendering: -webkit-optimize-contrast" />
    </view>
  </IFexHeaderMain>
</template>

<script setup lang="ts" name="index">
  import { computed, onMounted, ref } from 'vue'
  import IFexHeaderMain from '@/components/container/IFexHeaderMain.vue'
  import useUserInfoStore from '@/store/userInfo'
  const userName = computed(() => {
    const userInfoStore = useUserInfoStore()
    return userInfoStore.getDetailData.userName
  })
  const idCard = computed(() => {
    const userInfoStore = useUserInfoStore()
    return userInfoStore.getDetailData.idCard
  })
  const onClick = () => {
    uni.navigateTo({ url: '/pages/fc/sfrz' })
  }
</script>

<style scoped lang="scss">
  .home_main {
    background: #ffffff;
    font-size: 34rpx;
  }
  .from_input {
    margin-left: 50rpx;
    border-bottom: 1px solid #f7f7f7;
    line-height: 135rpx;
  }
  uni-image {
    height: auto;
  }
</style>
